<template>
  <view class="container">
    <uni-collapse ref="collapse" accordion :show-animation="true">
      <uni-collapse-item v-for="(item, index) in layertree" :key="index" :title="item.equipmentName">
        <uni-list class="list">
          <uni-list-item v-for="(ite, ind) in item.childNodes" :key="ind" :title="ite.equipmentName" @click="toDetail(ite)" clickable class="list_item"></uni-list-item>
        </uni-list>
      </uni-collapse-item>
    </uni-collapse>
  </view>
</template>

<script>
  export default {
    data() {
      return {
        layertree: [],
      }
    },
    onLoad(options) {
      this.getTree()
    },
    methods: {
      // 获取列表
      getTree() {
        this.$request.getdeviceTree({ pid: 0 }).then(res => {
          let tree = res.data || []
          tree.forEach(v => {
            if(v.childNodes.length == 0) {
              v.childNodes.push(JSON.parse(JSON.stringify(v)))
            }
          })
          this.layertree = tree
        })
      },
      // 详情
      toDetail(item) {
        console.log('file: index.vue:38 ~ item:', item)
        // uni.navigateTo({ url: './detail?equipmentId=' + item.equipmentId })
        uni.navigateTo({ url: './details?data=' + JSON.stringify(item) })
      },
    },
  }
</script>

<style lang="scss" scoped>
  .list {
    .list_item {
      padding: 0 20rpx;
    }
  }
</style>
